@extends('layouts.admin')
@section('style')
    <style type="text/css">
        .menu_children{display:none;}
    </style>
@endsection
@section('content')
<div class="admin_main">
    <div class="admin_header_fixed">
        <div class="admin_header clearfix">
            <div class="title"><i></i>权限节点结构</div>
            <div class="action">
                <b></b>
                <div class="layui-btn-group ">
                    <a class="layui-btn layui-btn-primary layui-btn-small " href="{{ url('permission/create') }}">
                        <i class="fa fa-plus-circle"></i> 新增一级权限节点
                    </a>
                </div>
            </div>
        </div>
    </div>
    <div class="admin_base">
        <div id="menu_tree">
            @foreach($menus as $key => $menu)
              <div class="menu_level menu_level_1 {{ !isset($menu['children'])?'no_child':'' }} ">
                <div class="self clearfix" data-level="1">
                    <i class="lline"></i>
                    <span class="menu_action">
                        <a href="{{ url('permission/create?pid='.$menu['id']) }}"><i class="fa fa-plus"></i>添加子节点</a>
                        <a href="{{ url('permission/'.$menu['id'].'/edit') }}"><i class="fa fa-edit"></i>编辑</a>
                        <a href="{{ url('permission/'.$menu['id']) }}" class="J-item-delete"><i class="fa fa-close"></i>删除</a>
                    </span>
                    <span class="menu_info clearfix">
                        <i class="fa  {{ !isset($menu['children'])?'fa-minus-circle':'fa-plus-circle' }}  fa-lg left fa-icon"></i>
                        <span class="menu_title left">
                            <a href="{{ url('permission/'.$menu['id'].'/edit') }}">{{ $menu['title'] }}</a>
                        </span>
                        <span class="menu_id left">〖ID：{{ $menu['id'] }}〗</span>
                        <span class="left en-font">〖权限名称：{{ $menu['route_name'] }}〗</span>
                        @if(isset($menu['children'])) <span class="menu_child_count left">〖子节点数：{{ count($menu['children']) }}〗</span> @endif
                    </span>
                </div>
                @if(isset($menu['children']))
                  <div class="menu_children menu_children_1">
                    @foreach($menu['children'] as $menu1)
                        <div class="menu_level menu_level_2 {{ !isset($menu1['children'])?'no_child':'' }}">
                            <div class="self clearfix" data-level="2">
                                <i class="lline"></i>
                                <span class="menu_action">
                                    <a href="{{ url('permission/create?pid='.$menu1['id']) }}"><i class="fa fa-plus"></i>添加子节点</a>
                                    <a href="{{ url('permission/'.$menu1['id'].'/edit') }}"><i class="fa fa-edit"></i>编辑</a>
                                    <a href="{{ url('permission/'.$menu1['id']) }}" class="J-item-delete"><i class="fa fa-close"></i>删除</a>
                                </span>
                                <span class="menu_info clearfix">
                                    <i class="fa {{ !isset($menu1['children'])?'fa-minus-circle':'fa-plus-circle' }}   fa-lg left fa-icon"></i>
                                    <span class="menu_title left">
                                        <a href="{{ url('permission/'.$menu1['id'].'/edit') }}">{{ $menu1['title'] }}</a>
                                    </span>
                                    <span class="menu_id left">〖ID：{{ $menu1['id'] }}〗</span>
                                    <span class="left en-font">〖权限名称：{{ $menu1['route_name'] }}〗</span>
                                    @if(isset($menu1['children']))
                                        <span class="menu_child_count left">〖子节点数：{{ count($menu1['children']) }}〗</span>
                                    @else
                                        <span class="left en-font">〖方法：{{ $menu1['actions'] }}〗</span>
                                    @endif
                                </span>
                            </div>
                            @if(isset($menu1['children']))
                                <div class="menu_children menu_children_2">
                                    @foreach($menu1['children'] as $menu2)
                                        <div class="menu_level menu_level_3 {{ !isset($menu2['children'])?'no_child':'' }}">
                                            <div class="self clearfix" data-level="3">
                                                <i class="lline"></i>
                                                <span class="menu_action">
                                                    <a href="{{ url('permission/create?pid='.$menu2['id']) }}"><i class="fa fa-plus"></i>添加子节点</a>
                                                    <a href="{{ url('permission/'.$menu2['id'].'/edit') }}"><i class="fa fa-edit"></i>编辑</a>
                                                    <a href="{{ url('permission/'.$menu2['id']) }}" class="J-item-delete"><i class="fa fa-close"></i>删除</a>
                                                </span>
                                                <span class="menu_info clearfix">
                                                    <i class="fa {{ !isset($menu2['children'])?'fa-minus-circle':'fa-plus-circle' }}   fa-lg left fa-icon"></i>
                                                    <span class="menu_title left">
                                                        <a href="{{ url('permission/'.$menu2['id'].'/edit') }}">{{ $menu2['title'] }}</a>
                                                    </span>
                                                    <span class="menu_id left">〖ID：{{ $menu2['id'] }}〗</span>
                                                    <span class="left en-font">〖权限名称：{{ $menu2['route_name'] }}〗</span>
                                                    @if(isset($menu2['children']))
                                                        <span class="menu_child_count left">〖子节点数：{{ count($menu2['children']) }}〗</span>
                                                    @else
                                                        <span class="left en-font">〖方法：{{ $menu2['actions'] }}〗</span>
                                                    @endif
                                                </span>
                                            </div>
                                            @if(isset($menu2['children']))
                                                <div class="menu_children menu_children_3">
                                                    @foreach($menu2['children'] as $menu3)
                                                        <div class="menu_level menu_level_4 no_child">
                                                            <div class="self clearfix" data-level="4">
                                                                <i class="lline"></i>
                                                                <span class="menu_action">
                                                                    <a href="{{ url('permission/'.$menu3['id'].'/edit') }}"><i class="fa fa-edit"></i>编辑</a>
                                                                    <a href="{{ url('permission/'.$menu3['id']) }}" class="J-item-delete"><i class="fa fa-close"></i>删除</a>
                                                                </span>
                                                                <span class="menu_info clearfix">
                                                                    <i class="fa fa-minus-circle fa-lg left fa-icon"></i>
                                                                    <span class="menu_title left">
                                                                        <a href="{{ url('permission/'.$menu3['id'].'/edit') }}">{{ $menu3['title'] }}</a>
                                                                    </span>
                                                                    <span class="menu_id left">〖ID：{{ $menu3['id'] }}〗</span>
                                                                    <span class="left en-font">〖权限名称：{{ $menu3['route_name'] }}〗</span>
                                                                    <span class="left en-font">〖方法：{{ $menu3['actions'] }}〗</span>
                                                                </span>
                                                            </div>
                                                        </div>
                                                    @endforeach
                                                </div>
                                            @endif
                                        </div>
                                    @endforeach
                                </div>
                            @endif
                        </div>
                    @endforeach
                  </div>
                @endif
            </div>
          @endforeach
      </div>
    </div>
    <div class="admin_bottom"></div>
</div>
@endsection
@section("script")
<script type="text/javascript">
   layui.use(['layer','jquery'],function(){
       var $ = layui.$,
           layer = layui.layer;

       $('#menu_tree .self').click(function(){
           var level = $(this).data('level');
           var parent = $(this).parent('.menu_level') ;
           $('#menu_tree').find('.isClick').removeClass('isClick');
           parent.addClass('isClick');
           if(parent.hasClass('no_child')) return false ;
           if(parent.hasClass('isOpen'))
               parent.removeClass('isOpen').children('.menu_children').hide().end().children('.self').find('.fa-icon').removeClass('fa-minus-circle').addClass('fa-plus-circle')
           else
               parent.addClass('isOpen').children('.menu_children').show().end().children('.self').find('.fa-icon').removeClass('fa-plus-circle').addClass('fa-minus-circle')
       }).find('a').click(function(e){
           e.stopPropagation();
           if($(this).hasClass('J-item-delete')){
               var id = $(this).data('id');
               var url = $(this).prop('href');
               var confirm = $(this).data('confirm') || '删除后不能恢复，确定要删除吗?';
               var title = $(this).data('title') || '删除确认';
               if (parent.layer) {
                   var Layer = parent.layer;
               } else {
                   var Layer = layer;
               }
               Layer.confirm(confirm, {
                   title: title,
                   resize: false,
                   btn: ['立即删除', '再考虑一下'],
                   btnAlign: 'c',
                   anim: 1,
                   icon: 3
               }, function () {
                   $.ajax({
                       url: url,
                       dataType: 'json',
                       type: 'post',
                       data: {id: id, '_method': 'DELETE'},
                       success: function (res) {
                           if (res.code == 1) {
                               Layer.msg('删除成功', {icon: 6, times: 2000}, function () {
                                   document.location.reload();
                               })
                           } else {
                               Layer.msg(res.message, {icon: 5, times: 2000});
                           }
                       }
                   })
               })
               if (e && e.preventDefault) e.preventDefault(); else window.event.returnValue = false;
               return false;
           }
       })
   })
</script>
@endsection